<template>
	<view class="wrap">
		<view class="map-content" style="height:300px">
			<map  class="map-gis" id="mapGis" ref="mapGis" :show-scale="true" :enable-poi="true" :show-location="true"
				:enable-building="true" :enable-auto-max-overlooking="true" :enable-3D="true" :enable-overlooking="twoThree"
				 :enable-rotate="true" :enable-indoorMap="true"
				:scale="scale" :longitude="longitude" :latitude="latitude"
				:markers="markers" :polyline="polyline" 
				 @regionchange="bindregionchange" @markertap="markerTap"   :include-points="includePoints" 
				> 
				</map>
		</view>
		<scroll-view class="" style="height: 500px;">
			<view class="list-main" v-show="order">
			    <view class="display-flex-column">
					<view class="row-center tytop">
						<view class="type-desc">
							{{order.typeDesc?order.typeDesc:""}}
						</view>
						<view class="add_time">
							下单时间：{{order.addTimeDesc}}
						</view>
						<view class="status_desc">
							{{order.statusDesc?order.statusDesc:""}}
						</view>
					</view>
					<view class="row" style="margin-bottom: 15px;">
						<view class="display-flex-column">
							<view class="row-center">
								<view class="station_dot station_dot_start">
								</view>
								<view class="od-item">
									{{order.origin}}
								</view>
							</view>
							
							<view class="shu-line" style="margin: 0 18px;">
								
							</view>
							
							<view class="row-center">
								<view class="station_dot station_dot_end">
								</view>
								<view class="od-item">
									{{order.destination}}
								</view>
							</view>
						</view>
					</view>
					<view class="line"></view>
					<view class="row-center" style="margin: 14px 5px;">
						<view v-if="order.type==1" class="dan">
							出发：{{order.goTimeDesc}}
						</view>
						<view v-if="order.type==2" class="dan display-flex-column">
							<text>出发：{{order.goTimeDesc}}</text>
							<text>返程：{{order.backTimeDesc}}</text>
						</view>
						<view v-if="order.type==3" class="dan">
							用车天数：{{order.days}}天
						</view>
			
					</view>
					
				</view>
			</view>
			<view class="ex-main display-flex-column ">
				<view class="row-center ex-color">
					<text>用车人数</text>
					<text style="margin-left: auto;">{{order.peopleSum}}人</text>
				</view>
				<view v-for="(item,index) in order.carTypeList" :key="index" class="row-center ex-color">
					<text>{{item.name}}</text>
					<text style="margin-left: auto;">{{item.num}}辆</text>
				</view>
				<view class="row-center ex-color">
					<text>公里数</text>
					<text style="margin-left: auto;">{{order.distance}}公里</text>
				</view>
			</view> 
			<view  class="ex-main display-flex-column ">
				<view class="row-center ex-color">
					<text>原价</text>
					<text style="margin-left: auto;text-decoration: line-through;">￥{{order.originPrice?order.originPrice:"--"}}元</text>
				</view>
				<view class="row-center ex-color">
					<text>线上折扣价</text>
					<text style="margin-left: auto;color: #ff5500;">￥{{order.price?order.price:"--"}}元</text>
				</view>
				<view class="row-center ex-color">
					<text>包车ID</text>
					<text style="margin-left: auto;color: #0055ff;" >{{order.baocheId}}<text class='copy' @click='copy(order.baocheId)'>复制</text>	
					</text>
				</view>	
				<!-- <view class="row-center ex-color">
					<text>需支付定金</text>
					<text style="margin-left: auto;">￥{{order.tprice?order.tprice:"--"}}元</text>
				</view>
				<view class="row-center ex-color">
					<text>需支付尾款</text>
					<text style="margin-left: auto;">￥{{order.wprice?order.wprice:"--"}}元</text>
				</view> -->
			</view> 
			<view style="position:fixed;bottom:0;left:0;right:0;padding:20rpx 24rpx;padding-bottom:20rpx;background-color: #fff;">
				
				<view @click="orderCancel" v-if="order.status == 0"  style="background:#007AFF;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >取消订单</view>
				<view v-if="order.status == -1"  style="background:#9b9b9b;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >订单已取消</view>
				<view @click="goPay" v-if="order.status == 1"  style="background:#007AFF;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >立即支付定金（￥{{order.tprice?order.tprice:''}}）</view>
				<view @click="goPay" v-if="order.status == 2"  style="background:#007AFF;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >立即支付尾款（￥{{order.wprice?order.wprice:''}}）</view>
				<view  v-if="order.status == 5" class="row-center">
					<view  class="tuikuan" @click="orderCancel" >取消订单</view>
					
					<view class="dengdaifache"   @click="goPay">立即支付（￥{{order.price?order.price:''}}）</view>
					
				</view>
			
				<view  v-if="order.status == 6" class="row-center">
					<view  class="tuikuan" @click="applyRefund()" >申请退款</view>
					
					<view class="dengdaifache" >等待派车中</view>
					
				</view>
				<view v-if="order.status == 7"  style="background:#bdbdbd;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >申请退款中</view>
				<view v-if="order.status == 8"  style="background:#bdbdbd;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >已退款</view>
				
				<!-- <view v-if="order.status == 3||order.status == 4"  style="background:#007AFF;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >已完成</view> -->
				<view v-if="order.status == 3||order.status == 4" class="row-center">
					<view  class="fapiao" @click="goInvoice()" >申请发票</view>
					
					<view class="dengdaifache" >已完成包车</view>
					
				</view>
				<view v-if="order.status == 9"  style="background:#ff5500;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " >正在开票中</view>
				<view v-if="order.status == 10"  style="background:#ff5500;color:#fff;padding:26rpx;font-size:30rpx;z-index:9;text-align:center;border-radius: 6px; " @click="goInvoiceDetail" >已开票(查看详情)</view>
				<!-- SMS_463010382 -->
			</view>
			
		</scroll-view>
		<addInvoicing ref="addInvoicing" @changeInvoiceClose="changeInvoiceClose" :invoice='invoice'></addInvoicing>
		
		<payment :payMode='payMode' :type="3" :pay_close="pay_close" @onChangeFun='onChangeFun' 
			:totalPrice='totalPrice'></payment>
	</view>	
</template>

<script>
	import addInvoicing from '@/components/addInvoicing';
	
	import {
			mapGetters
		} from "vuex";
	import {
		toLogin
	} from '@/libs/login.js';
	
	import { userBaocheDetail,baocheCancel, baocheAppRefund } from "@/api/api.js"
    import { orderBaocheCreate, orderBaochePay, wxPayOrderBaocheResult } from "@/api/order.js"
    import payment from '@/components/payment';
      
	export default {
		computed: mapGetters(['isLogin', 'systemPlatform',]),
		components:{
			payment,addInvoicing
		},
		data() {
			return {
				invoice: {
					invoice: false,
					mer_id: 0
				}, //发票组件
				invoiceData: {}, // 发票数据
				systemType:'',
				latitude: "26.600324",
				longitude: "106.935849",
				scale: 8,
				markers: [],
				polyline: [],
				points:[],
				includePoints: [],
				baoche_id: '',
				order: '',
				order_type: 0,
				pay_close: false,
				totalPrice: "0",
				payType: 'weixin', //支付方式
				payChannel: 'routine',
				//支付方式
				payMode: [
					// #ifdef MP-WEIXIN || APP-PLUS
					{
						"name": "微信支付",
						"icon": "icon-weixin2",
						value: 'weixin',
						title: '微信快捷支付',
						payStatus: 1,
					},
					// #endif
					// #ifdef MP-ALIPAY || APP-PLUS
					{
						"name": "支付宝支付",
						"icon": "icon-zhifubao",
						value: 'alipay',
						title: '支付宝快捷支付',
						payStatus: 1,
					},
					
					 // #endif
					{
						"name": "余额支付",
						"icon": "icon-yuezhifu",
						value: 'yue',
						title: '可用余额:',
						payStatus: 1,
					},
				],
				
			};
		},
		onShow() {
			if(this.isLogin == true){
				uni.showLoading({
					title:'请稍后...'
				})
				 this.userBaocheDetail()
			}else{
				toLogin();
			}
			
	
		},
		onLoad(option) {	
			this.baoche_id= option.baoche_id
			
			// 去掉余额
			this.payMode[1].payStatus = 0;
			
			// #ifdef H5
			this.payChannel = this.$wechat.isWeixin() ? 'public' : 'weixinh5';
			// #endif
			// #ifdef MP-WEIXIN
			this.payChannel = 'routine';
			// #endif
			// #ifdef MP-ALIPAY
			this.payChannel = 'routineAlipay';
			this.payType = 'alipay';
			// #endif
			
			// #ifdef APP-PLUS
			this.payChannel = this.systemPlatform === 'ios' ? 'weixinAppIos' : 'weixinAppAndroid';
			// #endif
			var systemInfo =  uni.getSystemInfoSync();
			
			this.systemType =	systemInfo.system && systemInfo.system.indexOf("iOS") > -1 ? "IOS" : systemInfo.system && systemInfo.system.indexOf("Android") > -1 ? "ANDROID" : "OTHER";
			
		},
		onReady() {
		},
		methods:{
			
			copy: function(val) {
				let that = this;
				uni.setClipboardData({
					data: val,
					success() {
						that.$util.Tips({
							title: '复制成功'
						});
					}
				});
			},
			goInvoiceDetail(){
				if(this.baoche_id && this.totalPrice){
					uni.navigateTo({
						url:"/pages/bus/baoche/invoice_detail?baoche_id="+this.baoche_id
					})
				} else {
					this.$util.Tips({
						title: "参数错误，请返回首页！"
					});
				}
			},
			/**
			 * 开发票
			 */
			goInvoice: function(id) {
				// let that = this;
				// that.invoice.invoice = true;
				// that.invoice.mer_id = id;
				// this.$refs.addInvoicing.getInvoiceDefault();
				// this.$refs.addInvoicing.getInvoiceList();
				if(this.baoche_id && this.totalPrice){
					uni.navigateTo({
						url:"/pages/bus/baoche/invoice?baoche_id="+this.baoche_id+"&price="+this.totalPrice
					})
				} else {
					this.$util.Tips({
						title: "参数错误，请返回首页！"
					});
				}
				
			},
			applyRefund(){
				var that = this
				var d = new Date();
				var hour =  d.getHours()
				if(hour >= 20 || hour < 8){
					uni.showModal({
					    title: '温馨提示',
					    content: '当前时间非申请退款时间，请与08:00-20:00进行退款申请！',
						cancelText: '取消',
						confirmText: '我已知晓',
					    success: function (res) {
							
					    }
					});
					
					return ;
				}
				uni.showModal({
				    title: '申请退款',
				    content: '您确定提交申请退款？',
					cancelText: '取消',
					confirmText: '确认申请',
				    success: function (res) {
						if(res.confirm){
							baocheAppRefund({baocheId: that.baoche_id}).then(res => {
								uni.hideLoading()
								that.$util.Tips({
									title: "申请成功！"
								});
								that.userBaocheDetail()
							}).catch(err => {
								that.$util.Tips({
									title: err
								});
							})
						}
						
				    
				    }
				});
			},
			
			goPay() {
			
				this.pay_close = true;
			},

             /**
			 * 关闭支付组件
			 * 
			 */
			payClose: function() {
				this.pay_close = false;
			},
			/**
			 * 事件回调
			 *
			 */
			onChangeFun: function(e) {
				let opt = e;
				let action = opt.action || null;
				let value = opt.value != undefined ? opt.value : null;
				action && this[action] && this[action](value);
			},
			
			payCheck(type) {
				
				this.payType = type;
			
				this.SubOrder();
			},
			SubOrder: function(e) {
				let that = this,
					data = {};
			  
				if (!that.payType) return that.$util.Tips({
					title: '请选择支付方式'
				});
				
				// if (that.order_type !=1 || that.order_type!=0 ) return that.$util.Tips({
				// 	title: '参数错误'
				// });
			    
				data = {
					baocheId: that.baoche_id,
					orderType: that.order_type,
					payType: that.payType,
					payChannel: that.payChannel,
				}
				// if (data.payType == 'yue' && parseFloat(that.userInfo.now_money) < parseFloat(that.totalPrice))
				// 	return that.$util.Tips({
				// 		title: '余额不足！'
				// 	});
			
				uni.showLoading({
					title: '订单支付中'
				});
				that.payment(data);
			},
			
			payment: function(data) {
			
				let that = this;
			    orderBaocheCreate(data).then(res => {
					var order = res.data
					uni.showLoading({
						title:'请稍后...'
					})
					
				
					
					// #ifdef H5
					if(that.payType == 'alipay'){
						that.payChannel = 'alipay';
					}else if(that.payType == 'weixin' && this.$wechat.isWeixin()){
						that.payChannel = 'public';
					}else{
						that.payChannel = 'weixinh5';
					}
					// #endif
					// #ifdef APP-PLUS
					if(that.payType == 'alipay'){
						that.payChannel = 'appAliPay';
					}else if(that.payType == 'weixin'){
						that.payChannel = that.systemPlatform === 'ios' ? 'weixinAppIos' : 'weixinAppAndroid';
					}
					// #endif
					// #ifdef MP-ALIPAY
					that.payChannel = 'routineAlipay';
					// #endif
					let goPages = 'pages/bus/baoche/order_list'
					orderBaochePay({
						orderNo: order.orderNo,
						// #ifdef MP-WEIXIN
						payChannel: 'routine',
						// #endif
						// #ifdef MP-ALIPAY
						payChannel: 'routineAlipay',
						// #endif
						// #ifndef MP
						payChannel:that.payChannel,
						// #endif
						payType: that.payType
					}).then(res => {
						let jsConfig = res.data.jsConfig;
						that.order_id = res.data.orderNo;
						
						switch (res.data.payType) {
							case 'weixin':
							that.weixinBaochePay(jsConfig);
								break;
							case 'yue':
						        
								that.$util.Tips({
									title: "余额支付成功",
									icon: 'success'
								});
								uni.showLoading({
									title:'正在更新支付结果'
								})
								that.pay_success()
								setTimeout(res => {
									uni.hideLoading();
									that.userBaocheDetail()
								},3500)
						
								break;
							case 'weixinh5':
								uni.hideLoading();
								location.replace(jsConfig.mwebUrl + '&redirect_url=' + window.location.protocol +
									'//' + window.location.host + goPages + '&status=1');
								return that.$util.Tips({
									title: "支付中",
									icon: 'success'
								}, () => {
									that.pay_complete()
								});
								break;
							case 'alipay':
								//#ifdef H5
								if (this.$wechat.isWeixin()) {
									//微信公众号内支付
								} else {
									//h5支付
									uni.hideLoading();
									that.formContent = res.data.alipayRequest;
									uni.setStorage({key: 'orderNo', data:that.order_id});
									that.$nextTick(() => {
										document.forms['punchout_form'].submit();
									})
								}
								
								//#endif
								// #ifdef APP-PLUS
								
								let alipayRequest = res.data.alipayRequest;
								uni.requestPayment({
									provider: 'alipay',
									orderInfo: alipayRequest,
									success: (e) => {
										
										that.$util.Tips({
											title: "支付成功",
											icon: 'success'
										});
										uni.showLoading({
											title:'正在更新支付结果'
										})
										that.pay_success()
										setTimeout(res => {
											uni.hideLoading();
											that.userBaocheDetail()
										},3500)
															
									},
									fail: (e) => {
										uni.showModal({
											content: "支付失败",
											showCancel: false,
											success: function(res) {
												if (res.confirm) {
													//点击确认的操作
													that.pay_fail()
												} else if (res.cancel) {
													
												}
											}
										})
									},
									complete: () => {
										uni.hideLoading();
									},
								});
								// #endif
								
								// #ifdef MP-ALIPAY
								let alipayRequest = res.data.alipayRequest;
								uni.requestPayment({
									provider: 'alipay',
									orderInfo: alipayRequest,
									success: (e) => {
										
										that.$util.Tips({
											title: "支付成功",
											icon: 'success'
										});
										uni.showLoading({
											title:'正在更新支付结果'
										})
										that.pay_success()
										setTimeout(res => {
											uni.hideLoading();
											that.userBaocheDetail()
										},3500)
									},
									fail: (e) => {
										uni.showModal({
											content: "支付失败",
											showCancel: false,
											success: function(res) {
												if (res.confirm) {
													//点击确认的操作
													that.pay_fail()
												} else if (res.cancel) {
													
												}
											}
										})
									},
									complete: () => {
										uni.hideLoading();
									},
								});
								// #endif
								break;
						}
					}).catch(err => {
						uni.hideLoading();
						that.userBaocheDetail()
						return that.$util.Tips({
							title: err
						}, () => {
							that.pay_fail()
						});
					})
				}).catch(err => {
					console.log()
					uni.hideLoading();
					that.userBaocheDetail()
					return that.$util.Tips({
						title: err
					}, () => {
						that.pay_fail()
					});
				})	
			},
			
			weixinBaochePay(jsConfig){
				let that = this;
				let goPages = 'pages/bus/baoche/order_list'
				// #ifdef MP
				uni.requestPayment({
					timeStamp: jsConfig.timeStamp,
					nonceStr: jsConfig.nonceStr,
					package: jsConfig.packages,
					signType: jsConfig.signType,
					paySign: jsConfig.paySign,
					success: function(ress) {
						uni.hideLoading();
						wxPayOrderBaocheResult(that.order_id).then(res => {
							
							that.$util.Tips({
								title: "支付成功",
								icon: 'success'
							});
							uni.showLoading({
								title:'正在更新支付结果'
							})
							that.pay_success()
							setTimeout(res => {
								uni.hideLoading();
								that.userBaocheDetail()
							},3500)
													
						}).catch(err => {
							uni.hideLoading();
							console.log(444,err)
							return that.$util.Tips({
								title: err
							});
						})
					},
					fail: function(e) {
						uni.hideLoading();
						return that.$util.Tips({
							title: '取消支付'
						}, () => {
				
							that.pay_fail()
						});
					},
					complete: function(e) {
						uni.hideLoading();
						that.userBaocheDetail()
						if (e.errMsg == 'requestPayment:cancel') return that.$util
							.Tips({
								title: '取消支付'
							}, () => {
								
								that.pay_fail()
							});
					},
				})
				// #endif
				// #ifdef H5
				let datas = {
					timestamp: jsConfig.timeStamp,
					nonceStr: jsConfig.nonceStr,
					package: jsConfig.packages,
					signType: jsConfig.signType,
					paySign: jsConfig.paySign
				};
				that.$wechat.pay(datas).then(res => {
					if (res.errMsg == 'chooseWXPay:cancel') {
						that.userBaocheDetail()
						uni.hideLoading();
						return that.$util.Tips({
							title: '支付失败'
						});
					} else {
						wxPayOrderBaocheResult(that.order_id).then(res => {
							that.$util.Tips({
								title: "支付成功",
								icon: 'success'
							});
							uni.showLoading({
								title:'正在更新支付结果'
							})
							that.pay_success()
							setTimeout(res => {
								uni.hideLoading();
								that.userBaocheDetail()
							},3500)
						}).cache(err => {
							uni.hideLoading();
							return that.$util.Tips({
								title: err
							});
						})
					}
				
				}).cache(errW => {
					uni.hideLoading();
					return that.$util.Tips({
						title: errW
					});
				})
				// #endif
				// #ifdef APP-PLUS
				uni.requestPayment({
					provider: 'wxpay',
					orderInfo: {
						"appid": jsConfig.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
						"noncestr": jsConfig.nonceStr, // 随机字符串
						"package": "Sign=WXPay", // 固定值
						"partnerid": jsConfig.partnerid, // 微信支付商户号
						"prepayid": jsConfig.packages, // 统一下单订单号 
						"timestamp": Number(jsConfig.timeStamp), // 时间戳（单位：秒）
						"sign": this.systemPlatform === 'ios' ? 'MD5' : jsConfig
							.paySign // 签名，这里用的 MD5 签名
					}, //微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
					success: (e) => {
						uni.hideLoading();
						that.$util.Tips({
							title: "支付成功",
							icon: 'success'
						});
						uni.showLoading({
							title:'正在更新支付结果'
						})
						that.pay_success()
						setTimeout(res => {
							uni.hideLoading();
							that.userBaocheDetail()
						},3500)
					},
					fail: (e) => {
						that.userBaocheDetail()
						uni.hideLoading();
						uni.showModal({
							content: "支付失败",
							showCancel: false,
							success: function(res) {
								if (res.confirm) {
		
									that.pay_fail()
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						})
					},
					complete: () => {
						uni.hideLoading();
					},
				});
				// #endif
			},
			pay_complete: function() {
				this.$set(this, 'pay_close', false);
			},
			/**
			 * 支付失败回调
			 * 
			 */
			pay_fail: function() {
				this.pay_close = false;
			},
			pay_success: function() {
				this.pay_close = false;
			},
			initPolyLine(route){
				var that = this
				that.polyline = []
				that.points = []
				route.forEach(function(item){
					if(item['lat'] && item['lng']){
						that.points.push({latitude: item['lat'], longitude: item['lng']})
					} else {
						that.points.push({latitude: item[1], longitude: item[0]})
					}
					
				})
				
				// #ifdef MP-WEIXIN 
				var polyline = [{//指定一系列坐标点，从数组第一项连线至最后一项
							points:that.points,
							color:"#007AFF",//线的颜色
							width:9,//线的宽度
							borderColor: "#007AFF",
							dottedLine: false,
							borderWidth: true,
							arrowLine:true,	//带箭头的线 开发者工具暂不支持该属性
							 iconWidth:10,
						}]
				// #endif	
				// #ifdef  APP-PLUS
				var polyline = [{//指定一系列坐标点，从数组第一项连线至最后一项
							points:that.points,
							color:"#007AFF",//线的颜色
							width:12,//线的宽度
							borderColor: "#007AFF",
							dottedLine: false,
							borderWidth: true,
							arrowLine:true,	//带箭头的线 开发者工具暂不支持该属性
						}]
				// #endif	
				// #ifdef MP-ALIPAY
				var polyline = [{//指定一系列坐标点，从数组第一项连线至最后一项
							points:that.points,
							color: "#007AFFDD",
							width: 7,
							dottedLine: false
							// iconWidth:10,
						}]
				// #endif			
						// color: "#FF0000DD",
						// width: 5,
						// dottedLine: false
			    that.$set(that,'polyline',polyline)			
				that.polyline = polyline
			},
			
			userBaocheDetail(){
				uni.showLoading({
					title:'请稍后...'
				})
				userBaocheDetail({baocheId: this.baoche_id}).then(res => {
					uni.hideLoading()
					
					var routes = JSON.parse(res.data.routes)
					this.initMarker(res.data)
					this.initPolyLine(routes)
					this.order = res.data
					this.order_type = 2
					// this.totalPrice =  res.data.status == 2 ? res.data.wprice : res.data.tprice
					this.totalPrice = res.data.price
				}).catch(err => {
					uni.hideLoading()
					console.log(err)
					return this.$util.Tips({
						title: err
					});
				})
			},
			
			initMarker(baoche){
				var that = this
				
				var originMaker = {
				   id: 1,　	
				   latitude:baoche.originLat,
				   longitude: baoche.originLng,
				   iconPath: '/static/images/bus/start_point.png',
				   width:20,
				   height:20,
				   label: {
						content: baoche.origin,
						color: "#1B1B1B",
						fontSize: 12,
						padding: 1,
						textAlign: "center",
						bgColor: "#ffffff",
						borderRadius:5,
						y: "IOS" === that.systemType ? 10 : 7,
						x: -(baoche.origin.length % 2 == 0 ?baoche.origin.length / 2 * 12 : (baoche.origin.length - 1) / 2 * 12 + Math.floor(6)) - 3
								
					}
				 }
				
			  var destinationMaker = {
					   id: 2,
					   latitude:baoche.destinationLat,
					   longitude: baoche.destinationLng,
					   iconPath: '/static/images/bus/end_point.png',
					   width:20,
					   height:20,
					  
					   label:{
							content: baoche.destination,
							color: "#1B1B1B",
							fontSize: 12,
							padding: 1,
							textAlign: "center",
							bgColor: "#ffffff",
							borderRadius:5,
							y: "IOS" === that.systemType ? 10 : 7,
							x: -(baoche.destination.length % 2 == 0 ? baoche.destination.length / 2 * 12 : (baoche.destination.length - 1) / 2 * 12 + Math.floor(6)) - 3
						}
				}
				var mapCtx = uni.createMapContext("mapGis",this);
				mapCtx.includePoints({
				      padding: [ 70,],
				      points: [
									{
										longitude: baoche.originLng,
										latitude: baoche.originLat
									},
									{
										longitude: baoche.destinationLng,
										latitude: baoche.destinationLat
									}
								]
				    },)
    //             that.$set(that, 'includePoints', [
				// 	{
				// 		longitude: baoche.originLng,
				// 		latitude: baoche.originLat
				// 	},
				// 	{
				// 		longitude: baoche.destinationLng,
				// 		latitude: baoche.destinationLat
				// 	}
				// ]);			
				that.$set(that, 'markers', [originMaker,destinationMaker]);			
				
			},
			
			
			orderCancel(){
				uni.showLoading({
					title:'请稍后...'
				})
				baocheCancel({baocheId: this.baoche_id}).then(res => {
					uni.hideLoading()
					this.$util.Tips({
						title: "取消订单成功！"
					});
					this.userBaocheDetail()
					uni.navigateBack()
				}).catch(err => {
					this.$util.Tips({
						title: err.msg
					});
				})
			},
			
		},
		
		
	}
</script>

<style lang="scss" scoped>
	.map-content {
		width: 100%;
		background-color: #eee;
		// position: absolute;
		top: 0;
		left: 0;
		z-index: 99;
		.map-gis {
			width: 100%;
			height: 100%;
		}
	}
   .list-main{
		position: relative;
		margin: 12rpx 24rpx;
		background-color: #fff;
		border-radius: 4px;
	}
	
	.od-item{
		color: #888;
		font-size: 12px;
	}
	
	.ticket-item {
		margin-left: auto;
		margin-right: 20px;
	}
	.type-desc{
		background-color: #007aff;
		color: #fff;
		padding: 1px 3px;
		border-radius: 3px;
	}
	.add_time{
		margin-left: 4px;
		font-size: 13px;
		color: #a7a7a7;
	}
	.tytop{
		margin: 8px 5px;
	}
	.status_desc{
		margin-left: auto;
		color: #ff4231;
		font-weight: 700;
	}
	.dan{
		margin-left: 4px;
		font-size: 13px;
		color: #a7a7a7;
	}

  .ex-main{
		position: relative;
		margin: 60rpx 24rpx 0 24rpx;
		background-color: #fff;
		border-radius: 4px;
		padding: 10px;
	}
	.ex-color{
		color: #a7a7a7;
		font-size: 13px;
		margin-bottom: 13px;
	}
	.tuikuan{
		background: #9b9b9b;
		color: #fff;
		padding: 8px;
		font-size: 12px;
		z-index: 9;
		text-align: center;
		border-radius: 30px;
		width: 20%;
	}
	.fapiao{
		background: #ff5500;
		color: #fff;
		padding: 8px;
		font-size: 12px;
		z-index: 9;
		text-align: center;
		border-radius: 30px;
		width: 20%;
	}
	.dengdaifache{
		background: #007AFF;
		color: #fff;
		padding: 13px;
		font-size: 15px;
		z-index: 9;
		text-align: center;
		border-radius: 25px;
		width: 70%;
		margin-left: 15px;
	}
	.copy {
		font-size: 20rpx;
		color: #333;
		border-radius: 20rpx;
		border: 1rpx solid #666;
		padding: 3rpx 15rpx;
		margin-left: 24rpx;
	}
</style>